// 导航栏滚动效果
const navbar = document.getElementById('navbar');
window.addEventListener('scroll', () => {
    if (window.scrollY > 50) {
        navbar.classList.add('shadow-md');
        navbar.classList.remove('shadow-sm');
    } else {
        navbar.classList.remove('shadow-md');
        navbar.classList.add('shadow-sm');
    }
});

// 回到顶部按钮
const backToTopButton = document.getElementById('backToTop');
window.addEventListener('scroll', () => {
    if (window.scrollY > 300) {
        backToTopButton.classList.remove('opacity-0', 'invisible');
        backToTopButton.classList.add('opacity-100', 'visible');
    } else {
        backToTopButton.classList.add('opacity-0', 'invisible');
        backToTopButton.classList.remove('opacity-100', 'visible');
    }
});

backToTopButton.addEventListener('click', () => {
    window.scrollTo({
        top: 0,
        behavior: 'smooth'
    });
});

// 板块选择功能
const categoryBtns = document.querySelectorAll('.category-btn');
const categoryInput = document.getElementById('postCategory');
let selectedCategory = '';

categoryBtns.forEach(btn => {
    btn.addEventListener('click', function() {
        // 移除所有按钮的选中状态
        categoryBtns.forEach(b => {
            b.classList.remove('border-primary', 'bg-primary/5');
            b.classList.add('border-gray-200');
        });

        // 添加当前按钮的选中状态
        const category = this.dataset.category;
        this.classList.remove('border-gray-200');
        this.classList.add('border-primary', 'bg-primary/5');

        // 更新隐藏输入框的值
        selectedCategory = category;
        categoryInput.value = category;
    });
});

// 表单提交
const postForm = document.getElementById('postForm');
postForm.addEventListener('submit', function(e) {
    e.preventDefault();

    const title = document.getElementById('postTitle').value;
    const category = document.getElementById('postCategory').value;
    const content = document.getElementById('postContent').value;

    if (!category) {
        alert('请选择帖子板块');
        return;
    }

    if (!title) {
        alert('请输入帖子标题');
        return;
    }

    if (!content) {
        alert('请输入帖子内容');
        return;
    }

    // 这里可以添加表单提交逻辑
    alert(`帖子发布成功！板块：${getCategoryName(category)}`);
    postForm.reset();

    // 重置板块选择
    categoryBtns.forEach(b => {
        b.classList.remove('border-primary', 'bg-primary/5');
        b.classList.add('border-gray-200');
    });
    selectedCategory = '';
    categoryInput.value = '';
});

// 获取板块名称
function getCategoryName(category) {
    const names = {
        'food': '美食天地',
        'sports': '运动健身',
        'study': '学习交流',
        'campus': '校园趣事'
    };
    return names[category] || '未知板块';
}
//用于访问文件夹获取发帖照片的
document.addEventListener('DOMContentLoaded', function() {
    const fileInput = document.getElementById('fileInput');
    const selectImageBtn = document.getElementById('selectImageBtn');
    const uploadArea = document.getElementById('uploadArea');
    const imagePreview = document.getElementById('imagePreview');
    const uploadIcon = document.getElementById('uploadIcon');

    // 点击选择图片按钮触发文件选择
    selectImageBtn.addEventListener('click', function() {
        fileInput.click();
    });

    // 处理文件选择
    fileInput.addEventListener('change', function(e) {
        const files = e.target.files;
        if (files.length > 0) {
            handleFiles(files);
        }
    });

    // 拖放功能
    uploadArea.addEventListener('dragover', function(e) {
        e.preventDefault();
        uploadArea.classList.add('border-primary');
    });

    uploadArea.addEventListener('dragleave', function() {
        uploadArea.classList.remove('border-primary');
    });

    uploadArea.addEventListener('drop', function(e) {
        e.preventDefault();
        uploadArea.classList.remove('border-primary');
        const files = e.dataTransfer.files;
        if (files.length > 0) {
            handleFiles(files);
        }
    });

    // 处理选择的文件
    function handleFiles(files) {
        // 清空预览区域
        imagePreview.innerHTML = '';

        // 隐藏上传图标
        uploadIcon.classList.add('hidden');

        // 显示预览区域
        imagePreview.classList.remove('hidden');

        // 遍历所有选择的文件
        for (let i = 0; i < files.length; i++) {
            const file = files[i];

            // 检查文件类型
            if (!file.type.match('image.*')) {
                continue;
            }

            // 创建预览元素
            const reader = new FileReader();
            reader.onload = function(e) {
                const previewItem = document.createElement('div');
                previewItem.className = 'relative group';

                const img = document.createElement('img');
                img.src = e.target.result;
                img.className = 'w-full h-32 object-cover rounded-lg';

                const removeBtn = document.createElement('button');
                removeBtn.className = 'absolute top-1 right-1 bg-red-500 text-white rounded-full w-6 h-6 flex items-center justify-center opacity-0 group-hover:opacity-100 transition-opacity';
                removeBtn.innerHTML = '<i class="fa fa-times text-xs"></i>';
                removeBtn.addEventListener('click', function() {
                    previewItem.remove();
                    if (imagePreview.children.length === 0) {
                        uploadIcon.classList.remove('hidden');
                        imagePreview.classList.add('hidden');
                    }
                });

                previewItem.appendChild(img);
                previewItem.appendChild(removeBtn);
                imagePreview.appendChild(previewItem);
            };
            reader.readAsDataURL(file);
        }
    }
});
// 在forum_post_create.js中添加表单提交处理：
document.getElementById('postForm').addEventListener('submit', function(e) {
    e.preventDefault();

    // 获取表单数据
    const formData = new FormData(this);

    // 添加其他表单数据
    formData.append('postTitle', document.getElementById('postTitle').value);
    formData.append('postContent', document.getElementById('postContent').value);
    formData.append('category', document.getElementById('postCategory').value);

    // 发送AJAX请求
    fetch('${pageContext.request.contextPath}/uploadPost', {
        method: 'POST',
        body: formData
    })
        .then(response => {
            if (response.ok) {
                return response.json();
            }
            throw new Error('Network response was not ok.');
        })
        .then(data => {
            // 处理成功响应
            alert('帖子发布成功！');
            window.location.href = 'forum_index.jsp'; // 跳转到首页或其他页面
        })
        .catch(error => {
            console.error('Error:', error);
            alert('发布失败: ' + error.message);
        });
});